<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JTopo</title>

<style type="text/css">
.topoHolder {
	position: relative;
	margin: 0px auto;
	padding: 0px;
	width: 850px;
	height: 336px;
	overflow: hidden;
	border:1px solid #cfcfcf;
	
}
.divTopoHolder .topoMap {

}
/* 工具栏 */
.jtopo_toolbar{
	padding-left:20px;
	background-color: rgb(216, 231, 242);
	width: 100%;
	height: 28px;
	padding-top: 7px;
	font-family: "微软雅黑";
	font-size: 14px;
}
.jtopo_toolbar input,radio,button,label{
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 0px;
	margin-right: 0px;
}

</style>
<script type="text/javascript" src="js/jquery.js"></script>
<link  href="css/scroll/perfect-scrollbar.css" rel="stylesheet" />
</head>
<body>
	
	
	<div class="topoHolder" id="divTopoHolder">
		<canvas class="topoMap" id="topoCvs" width="850" height="300">
			
		</canvas>
	</div>
	
	
<script type="text/javascript" src="js/jtopo-min.js"></script>
<script type="text/javascript" src="js/TopoToolBar.js"></script>
<script type="text/javascript" src="js/scroll/jquery.mousewheel.js"></script>
<script type="text/javascript" src="js/scroll/perfect-scrollbar.js"></script>
<script type="text/javascript" src="js/my/Topo.js"></script>

	<script type="text/javascript">
		$(document).ready(function() {
			//$('#divTopoHolder').perfectScrollbar();
			//{suppressScrollX: true}
			drawTopo();
		});

	</script>
</body>
</html>
